<template>
<transition name="el-zoom-in-center">
    <div id="chazhaolan" style="display: inline-block;">
				<input type="text" class="chazhaolan" v-model="zhi" size="mini" placeholder="no more 10 words">
				<a class="chazhao_alink a_noline" @click="chazhaojian" href="#"><i class="el-icon-search"></i>查找</a>   
				&nbsp;&nbsp;&nbsp;&nbsp;{{chazhaotype}}--{{zhi}}--{{serverResponse}}--
				<a @click="shuaxinjian" class="chazhao_alink a_noline" href="#">刷新<i class="el-icon-refresh"></i>还原</a>
		</div>
</transition>
</template>

<script>
import axios from 'axios';
export default {

  props: {chazhaotype: String},
	data() {return {zhi: 'ceshi',serverResponse: 'resp',content:''}},
	methods:{chazhaojian:function(){alert(this.zhi);},
			 shuaxinjian:function(){
				var that = this;
				const path = 'http://127.0.0.1:5000/getMsg';
				axios.get(path).then(function (response) {
					var msg = response.data.msg;
					that.serverResponse = msg;
					alert('Success ' + response.status + ', ' + response.data + ', ' + msg);
					}).catch(function (error) {alert('Error ' + error);})
			}
			},

};

</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
		.chazhao_alink{
					 font-size:18px;
						}

		.chazhaolan{
					width:200px;
					border:none;
					border-radius:0;
					border-bottom:#8D8D8D 1px solid;
					box-shadow:0;
					outline:none;
					text-decoration: none;
		}
    
</style>
